<template>
  <div class="">
    <Loading v-show="$store.state.isLoading" />
    <div class="container">
      <Swipe :banners="banners"></Swipe>
      <citySubNav :shortCut="shortCut" @triggeEvent="triggeEvent"></citySubNav>
      <List1 :obj="weekPush" @gotoContent="afterClick"></List1>
      <List2 :obj="weekPopular" @gotoContent="afterClick"></List2>
      <List3 :obj="hotList" @gotoDetail="gotoDetail"></List3>
      <List2 :obj="mustRead" @gotoContent="afterClick"></List2>
      <List2 :obj="HighDrama" @gotoContent="afterClick"></List2>
      <List3 :obj="endList" @gotoDetail="gotoDetail"></List3>
      <List2 :obj="goodQuality" @gotoContent="afterClick"></List2>
      <List2 :obj="everyBodyWatch" @gotoDetail="afterClick"></List2>
    </div>
  </div>
</template>

<script>
import { getStoreData, getJingPing } from "@/request/api";
import Swipe from "@/components/swipe";
import citySubNav from "@/components/citySubNav";
import List1 from "@/components/List1";
import List2 from "@/components/List2";
import List3 from "@/components/List3";

export default {
  components: {
    Swipe,
    citySubNav,
    List1,
    List2,
    List3,
  },

  data() {
    return {
      //广告
      banners: [],
      shortCut: [],
      //本周强推
      weekPush: {
        list: [],
        name: "",
      },
      weekPopular: {
        list: [],
        name: "",
      },
      //24小时热销榜
      hotList: {
        list: [],
        name: "",
        more: {
          name: "",
          url: "",
        },
      },
      //精品必读
      mustRead: {
        list: [],
        name: "",
      },
      //高能剧情
      HighDrama: {
        list: [],
        name: "",
      },
      //完结榜
      endList: {
        list: [],
        name: "",
        more: {
          name: "",
          url: "",
        },
      },
      //优质好文
      goodQuality: {
        list: [],
        name: "",
      },
      //大家都在看
      everyBodyWatch: {
        list: [],
        name: "",
      },
      //最热新书榜
      newList: {
        list: [],
        name: "",
        more: {
          name: "",
          url: "",
        },
      },
    };
  },
  methods: {
    afterClick(obj) {
      this.$router.push(
        "/content?source_uuid=" + obj.id + "&title=" + obj.title
      );
    },
    gotoDetail(id) {
      this.$router.push("/detail?sourceUuid=" + id);
    },
    triggeEvent(arr) {
      let _url = arr[0];
      if (_url.indexOf("163.com") != -1) {
        window.location.href = _url;
        return;
      }
      let params = _url.split("?")[1];

      if (params.indexOf("&") == -1) {
        let param1 = params.split("=")[0];
        let p1 = params.split("=")[1];
        this.$router.push({
          name: "navcate",
          query: { params: p1, name: arr[1] },
        });
      } else {
        let p1 = params.split("&")[0].split("=")[1];
        let p2 = params.split("&")[1].split("=")[1];
        this.$router.push({
          name: "paihang",
          query: { uuid: p1, rankType: p2 },
        });
      }
    },
  },
  mounted() {
    getStoreData({
      type: this.$route.query.type,
      uuid: this.$route.query.uuid,
    }).then((res) => {
      if (res.resCode == 0) {
        let list = res.data.list;
        this.banners = list[0].banners;
        this.shortCut = list[1].shortCut;
        this.weekPush.name = list[2].name;
        this.weekPush.list = list[2].list;

        this.weekPopular.name = list[3].name;
        this.weekPopular.list = list[3].list;

        this.hotList.name = list[4].name;
        this.hotList.list = list[4].list;
        this.hotList.more = list[4].more;

        this.mustRead.name = list[5].name;
        this.mustRead.list = list[5].list;

        this.HighDrama.name = list[6].name;
        this.HighDrama.list = list[6].list;

        this.endList.name = list[7].name;
        this.endList.list = list[7].list;
        this.endList.more = list[7].more;

        this.goodQuality.name = list[8].name;
        this.goodQuality.list = list[8].list;

        this.everyBodyWatch.name = list[3].name;
        this.everyBodyWatch.list = list[3].list;
      }
    });
  },
};
</script>

<style lang="scss" scoped>
</style>>
